<!doctype html>
<html class="no-js">
<head>
    <title>中信银行关联图谱poc</title>
    {{include 'base/style.html'}}
    <style>
        .loading-panel {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 160px;
}
.loading-panel .box {
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
}
    </style>
</head>

<body id="ajax-template" data-type="index">

<div class="am-g tpl-g">
    {{include 'baseadmin/header.html'}}
    {{include 'baseadmin/skin.html'}}
    {{include 'baseadmin/sidebar.html'}}
    <div class="tpl-content-wrapper">
    </div>
</div>

<!--<div class="am-modal am-modal-loading am-modal-no-btn" tabindex="-1" id="my-modal-loading">-->
  <!--<div class="am-modal-dialog">-->
    <!--<div class="am-modal-hd">正在载入...</div>-->
    <!--<div class="am-modal-bd">-->
      <!--<span class="am-icon-spinner am-icon-spin"></span>-->
    <!--</div>-->
  <!--</div>-->
<!--</div>-->
<!--<div id="loading" class="loading-panel">-->
    <!--<div class="box">-->
        <!--<i class="fa fa-refresh fa-spin"></i> <span class="tip"> 正在加载 · · · </span>-->
    <!--</div>-->
<!--</div>-->

{{include 'base/jsFile.html'}}

<script>
    $(function () {
        autoLeftNav();
        $(window).resize(function () {
            autoLeftNav();
            console.log($(window).width())
        });


        $("#ajax-template").on("click", "a[target='navTab']", function () {

//            debugger;
//            var my_modal_loading=$("#my-modal-loading");
//             my_modal_loading.modal('open');
//            $("#loading").show();
            var that = $(this);
            var _text = that.text();
            var _href = that.attr("href");
            $.ajax({
                url: _href,
                dataType: "html",
                success: function (result) {
                    $(".tpl-content-wrapper").html(result);

                },
                error: function (err) {
                    console.log(err)
                },
                complete:function (){
//                    my_modal_loading.modal('close');
//$("#loading").hide();
                }
            });
            return false;
        });
        a_obj=$("a[target='navTab']");
        if(a_obj.length>0){
            a_obj[0].click();
        }

    });


    var saveSelectColor = {
        'Name': 'SelcetColor',
        'Color': 'theme-black'
    }

    // 判断用户是否已有自己选择的模板风格
    if (storageLoad('SelcetColor')) {
        $('body').attr('class', storageLoad('SelcetColor').Color)
    } else {
        storageSave(saveSelectColor);
        $('body').attr('class', 'theme-white')
    }


    // 本地缓存
    function storageSave(objectData) {
        localStorage.setItem(objectData.Name, JSON.stringify(objectData));
    }

    function storageLoad(objectName) {
        if (localStorage.getItem(objectName)) {
            return JSON.parse(localStorage.getItem(objectName))
        } else {
            return false
        }
    }


    // 侧边菜单开关


    function autoLeftNav() {
        $('.tpl-header-switch-button').on('click', function () {
            if ($('.left-sidebar').is('.active')) {
                if ($(window).width() > 1024) {
                    $('.tpl-content-wrapper').removeClass('active');
                }
                $('.left-sidebar').removeClass('active');
            } else {

                $('.left-sidebar').addClass('active');
                if ($(window).width() > 1024) {
                    $('.tpl-content-wrapper').addClass('active');
                }
            }
        })

        if ($(window).width() < 1024) {
            $('.left-sidebar').addClass('active');
        } else {
            $('.left-sidebar').removeClass('active');
        }
    }


    // 侧边菜单
    $('.sidebar-nav-sub-title').on('click', function () {
        $(this).siblings('.sidebar-nav-sub').slideToggle(80)
            .end()
            .find('.sidebar-nav-sub-ico').toggleClass('sidebar-nav-sub-ico-rotate');
    })

    // 风格切换

    $('.tpl-skiner-toggle').on('click', function () {
        $('.tpl-skiner').toggleClass('active');
    })

    $('.tpl-skiner-content-bar').find('span').on('click', function () {
        $('body').attr('class', $(this).attr('data-color'))
        saveSelectColor.Color = $(this).attr('data-color');
        // 保存选择项
        storageSave(saveSelectColor);

    })
</script>
</body>

</html>